<!-- titre=<multi>[fr]Personnalisation de l'affichage public - Ent&ecirc;te </multi>-->
<!-- descriptif=<multi>[fr]Personnalisation du squelette - Ent&ecirc;te du site</multi>
<br /><a href="http://tispip.etab.ac-caen.fr/spip.php?article202" class="spip_out">Vers documentation</a>
-->

<!-- nom=tispipskelet_conf -->
<!-- casier=entete -->

<!-- onglet=tispipskelet_conf -->
<!-- liens*=tispipskelet_conf -->
<!-- liens*=tispipskelet_conf_entete -->
<!-- liens*=tispipskelet_conf_accueil -->
<!-- liens*=tispipskelet_conf_rubriques -->
<!-- liens*=tispipskelet_conf_articles -->
<!-- liens*=tispipskelet_conf_couleurs -->
<!-- liens*=tispipskelet_conf_background -->
<!-- liens*=tispipskelet_conf_slide_show-->
<!-- liens*=tispipskelet_conf_infos_legales-->
<!-- liens*=tispipskelet_conf_credits-->
<!-- liens*=tispipskelet_conf_save-->

<!-- depot=metapack -->

<!-- head=<link rel='stylesheet' href='../plugins/tispip_skelet/css/farbtastic.css' type='text/css' />
<script langage='javascript' src='../plugins/tispip_skelet/scripts/farbtastic.js'></script>
<style type='text/css'>
.colorpicker { border:2px solid #ccc; text-align:center; margin:0.5em auto; height:auto; width:200px; display:inlight}
.colorpicker_bar { background-color:#ccc; height:1.5em; text-align:right; padding-right:0.5em; color:black; }
.colorpicker_close {display:inline; height: 1em; padding:0 2px; font-weight:bold; margin: 0 0 0 auto; border:1px solid transparent;}
.colorpicker_close:hover { border:1px solid #888; background:white}
.colorpicker_hide { height:auto; display:block; }
.hover { cursor:pointer; }
.fondl{display:inline;float:tight}
</style>
<script type='text/javascript'>
	var colorpicker_is_active = false;
	$(document).ready(function() {
		$('.cfg_couleur').each(function(){
			$(this).css('background-color',$(this).attr('value'));
			/* pas de id : on en cree un aleatoire */
			if (!$(this).attr('id')){ 
				$(this).attr('id', parseInt(10000*Math.random()));
			}
		});
		$('.cfg_couleur').click(function() { 
			if(colorpicker_is_active) return(false);
			var color_dest = $(this).attr('id');
			$(this).addClass('colorpicker_hide');
			$(this).after('<div class=\'colorpicker\' style=\'z-index:999\'><div class=\'colorpicker_bar\'><div class=\'colorpicker_close\'>X</div></div><div id=\'colorpicker\'></div></div>');
			$('#colorpicker').css({display:'block'}).farbtastic('#'+color_dest);
			colorpicker_is_active = true;
			$('.colorpicker_close').hover(function(){
				$(this).addClass('hover');
			},function(){
				$(this).removeClass('hover');
			});
			$('.colorpicker_close').click( function() { 
				$(this).removeClass('colorpicker_hide');
				$('.colorpicker').empty().remove();
				colorpicker_is_active = false;
			});
		});
	});
</script>-->
#CACHE{0}


[<p class='formulaire_erreur'>(#ENV*{message_erreur})</p>]
[<p class="formulaire_message">(#ENV*{message_ok})</p>]

<form method="post" enctype="multipart/form-data" id="form_cfg_tispipskelet"><div>
[(#ENV{_cfg_}|form_hidden)]

<fieldset>
	<legend>Dimensions de l&rsquo;ent&ecirc;te</legend>
		<ul>
[(#REM) partie a supprimer
			<li>
			<div class="labels_cfg_tispipskelet">
				<label for="hauteur_entete">Hauteur de l&rsquo;ent&ecirc;te : </label>
				<input type="text" name="hauteur_entete" id="hauteur_entete" class="fondl cfg_couleur" size="3"  value="[(#ENV{hauteur_entete}|?{#ENV{hauteur_entete},135})]" />
			</div>
			</li>
]
			<li>
			<div class="labels_cfg_tispipskelet">
					<label>
					<input type="radio" name="largeur_entete" value="ecran"[ (#ENV{largeur_entete}|?{'',checked})] [(#ENV{largeur_entete}|=={ecran}|?{checked,''})] />Largeur de l&rsquo;&eacute;cran</label><br />
					<label>
					<input type="radio" name="largeur_entete" value="page"[ (#ENV{largeur_entete}|=={page}|?{checked,''})] />Largeur de la page</label><br />
			</div>
			</li>
		</ul>
</fieldset>

<fieldset>
	<legend>Arri&egrave;re plan</legend>
		<ul>
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label class="titre"><input type="checkbox" name="affgradient_entete" value="oui" [checked="(#ENV{affgradient_entete}|?{checked})"] id="affgradient_entete" /> Afficher d&eacute;grad&eacute; de couleurs
					</label>
					<div class="help_text"><:tispipskelet:help_entete_gradient:></div>
				<div class="labels_cfg_tispipskelet">
			</li>
			<li id="cfggradient_entete">
				<div class="labels_cfg_tispipskelet">
					<div class="form-item">
						<span class="label_couleur"><label for="gradientstart_entete">Couleur de d&eacute;pard :</label></span>
						<input type="text" name="gradientstart_entete" id="gradientstart_entete" class="fondl cfg_couleur" size="7" value="[(#ENV{gradientstart_entete}|?{#ENV{gradientstart_entete},#ffffff})]" />
					</div>
					<div class="form-item">
						<span class="label_couleur"><label for="gradientend_entete">Couleur d&rsquo;arriv&eacute;e :</label></span>
						<input type="text" name="gradientend_entete" id="gradientend_entete"  class="fondl cfg_couleur" size="7"  value="[(#ENV{gradientend_entete}|?{#ENV{gradientend_entete},#000000})]" />
					</div>
				</div>
				<div class="labels_cfg_tispipskelet">
					<span style="font-style=none"><u>Orientation du d&eacute;grad&eacute; </u></span><br />
					<div class="demi gauche">
						<label>
						<input type="radio" name="dirgradient_entete" value="vertical" id="posV" [(#ENV{dirgradient_entete}|=={vertical}|?{checked,''})] />Horizontal</label><br />
					</div>
					<div class="demi gauche">
						<label>
						<input type="radio" name="dirgradient_entete" value="horizontal" id="posH" [(#ENV{dirgradient_entete}|=={horizontal}|?{checked,''})] />Vertical</label><br />
					</div>
				</div><br />
				<div class="labels_cfg_tispipskelet ">
					<span style="font-style=none"><u>Position du d&eacute;grad&eacute; </u></span><br />
					<div class="demi gauche">
						<label>
						<input type="radio" name="posgradient_entete" value="left" class="noPosH" [(#ENV{posgradient_entete}|=={left}|?{checked,''})] />&Agrave; gauche</label><br />
					</div>
					<div class="demi gauche">
						<label>
						<input type="radio" name="posgradient_entete" value="right" class="noPosH" [(#ENV{posgradient_entete}|=={right}|?{checked,''})] />&Agrave; droite</label><br />
					</div><br />
					<div class="demi gauche">
						<label>
						<input type="radio" name="posgradient_entete" value="top" class="noPosV" [(#ENV{posgradient_entete}|=={top}|?{checked,''})] />En haut</label><br />
					</div>
					<div class="demi gauche">
						<label>
						<input type="radio" name="posgradient_entete" value="bottom" class="noPosV" [(#ENV{posgradient_entete}|=={bottom}|?{checked,''})] />En bas</label><br />
					</div><br class="leon"/>
				</div>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<span style="font-style=none"><u>Longueur du d&eacute;grad&eacute; </u></span><br />
					<label>Longueur (en pixels)
					<input type="text" name="gradientlenght_entete" size="4" value="[(#ENV{gradientlenght_entete}|?{#ENV{gradientlenght_entete},''})]" /></label>
					<div class="help_text"><:tispipskelet:help_entete_gradient_length:></div>
				</div>
			</li>
		</ul>
<script type="text/javascript"><!--
	$('#posH')
		.bind('change', function() {
		var on = $(this).is(':checked');
		$('.noPosH').attr('disabled', on ? 'disabled' : '');
		$('.noPosV').removeAttr('disabled');
	})
	$('#posV')
		.bind('change', function() {
		var on = $(this).is(':checked');
		$('.noPosV').attr('disabled', on ? 'disabled' : '');
		$('.noPosH').removeAttr('disabled');
	})	
	$(function() {
		var onV = $('#posV').is(':checked');
		$('.noPosV').attr('disabled', onV ? 'disabled' : '');
		var onH = $('#posH').is(':checked');
		$('.noPosH').attr('disabled', onH ? 'disabled' : '');
	});
// --></script>
		<ul>
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label class="titre"><input type="checkbox" name="affimgbg_entete" value="oui" [checked="(#ENV{affimgbg_entete}|?{checked})"] id="affimgbg_entete" /> Afficher une image d&rsquo;arri&egrave;re plan
					</label>
					<div class="help_text"><:tispipskelet:help_entete_bg:></div>
				<div class="labels_cfg_tispipskelet">
			</li>
		</ul>
		<div id="imgbg_entete">
		<ul>
			<li>
				<div class="labels_cfg_tispipskelet">
					<label>Charger l'&rsquo;image d&rsquo;arri&egrave;re plan :
					<input type="file" name="logo_entete" value=" " size="30" /></label>
					[<span class='erreur'>(#ENV**{erreurs}|table_valeur{logo_entete})</span>]
					<br />	
		
					<h5>Image actuelle</h5>
					<dl>		
						<dt>[(#ENV{logo_entete}|?{[(#CFG_CHEMIN{tispipskelet_conf/entete/logo_entete}|image_reduire{100})],Aucune image})]</dt>
					</dl>
				</div>
			</li>
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label for="logo_entete_repeat">R&eacute;p&eacute;tition de l&rsquo;image : </label>
					<select name="logo_entete_repeat" id="logo_entete_repeat">
						<option value=""[(#ENV{logo_entete_repeat}|?{selected="selected",''})]>  </option>
						<option value="no-repeat"[(#ENV{logo_entete_repeat}|=={no-repeat}|?{selected="selected",''})]> Pas de r&eacute;p&eacute;tition </option>
						<option value="repeat-x"[(#ENV{logo_entete_repeat}|=={repeat-x}|?{selected="selected",''})]> R&eacute;p&eacute;tition horizontale</option>
						<option value="repeat-y"[(#ENV{logo_entete_repeat}|=={repeat-y}|?{selected="selected",''})]> R&eacute;p&eacute;tition verticale </option>
					</select>
					<div class="help_text"><:tispipskelet:help_entete_bg_repetition:></div>
				</div>
			</li>
			<li>
				<div class="labels_cfg_tispipskelet">
					<label for="logo_entete_pos_h">Position horizontale de l&rsquo;image : </label>
					<select name="logo_entete_pos_h" id="logo_entete_pos_h">
						<option value=""[(#ENV{logo_entete_pos_h}|?{selected="selected",''})]>  </option>
						<option value="left"[(#ENV{logo_entete_pos_h}|=={left}|?{selected="selected",''})]> A gauche </option>
						<option value="center"[(#ENV{logo_entete_pos_h}|=={center}|?{selected="selected",''})]> Au centre </option>
						<option value="right"[(#ENV{logo_entete_pos_h}|=={right}|?{selected="selected",''})]> A droite </option>
					</select>
				</div>
			</li>
			<li>
				<div class="labels_cfg_tispipskelet">
					<label for="logo_entete_pos_v">Position verticale de l&rsquo;image : </label>
					<select name="logo_entete_pos_v" id="logo_entete_pos_v">
						<option value=""[(#ENV{logo_entete_pos_v}|?{selected="selected",''})]>  </option>
						<option value="top"[(#ENV{logo_entete_pos_v}|=={top}|?{selected="selected",''})]> En haut </option>
						<option value="center"[(#ENV{logo_entete_pos_v}|=={center}|?{selected="selected",''})]> Au centre </option>
						<option value="bottom"[(#ENV{logo_entete_pos_v}|=={bottom}|?{selected="selected",''})]> En bas </option>
					</select>
				</div>
			</li>
		</ul>
		</div>
	</fieldset>
<script type="text/javascript"><!--
	$('#affimgbg_entete')
	.bind('change', function() {
            $('#imgbg_entete').slideToggle('slow');
	})
	if ($('#affimgbg_entete:checked').length == 0)
		$('#imgbg_entete').hide();
		
	$('#affgradient_entete')
	.bind('change', function() {
            $('#cfggradient_entete').slideToggle('slow');
	})
	if ($('#affgradient_entete:checked').length == 0)
		$('#cfggradient_entete').hide();
		
	$('#affdegrade_entete')
	.bind('change', function() {
            $('#cfgdegrade_entete').slideToggle('slow');
	})
	if ($('#affdegrade_entete:checked').length == 0)
		$('#cfgdegrade_entete').hide();
// --></script>
	<fieldset>
		<legend>Logo et titre du site</legend>
		<ul>
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label class="titre"><input type="checkbox" name="afflogosite" value="oui" [checked="(#ENV{afflogosite}|?{checked})"] id="afflogosite" /> Afficher le logo du site
					</label>
					<div class="help_text"><:tispipskelet:help_entete_logo_site:></div>
				<div class="labels_cfg_tispipskelet">
			</li>
		</ul>
		<ul id="aff_img_palogo">
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label class="titre"><input type="checkbox" name="affimgpalogo" value="oui" [checked="(#ENV{affimgpalogo}|?{checked})" ][(#ENV{afflogosite}|?{' disabled="disabled"'})] id="affimgpalogo" /> Afficher une image autre que le logo
					</label>
					<div class="help_text"><:tispipskelet:help_entete_image:></div>
				</div>
				<div id="img_palogo" class="labels_cfg_tispipskelet">
					<label class="com">Charger l'&rsquo;image :
					<input type="file" name="imgpalogo" value="" size="30" /></label>
					[<span class='erreur'>(#ENV**{erreurs}|table_valeur{imgpalogo})</span>]
					<br />	
					<h5>Image actuelle</h5>
					<dl>		
						<dt>[(#ENV{imgpalogo}|?{[(#CFG_CHEMIN{tispipskelet_conf/entete/imgpalogo}|image_reduire{100})],Aucune image})]</dt>
					</dl>
				</div>
			</li>
		</ul>
		<ul>
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label class="titre"><input type="checkbox" name="afftitresite" value="oui" [checked="(#ENV{afftitresite}|?{checked})" ] id="afftitresite" /> Afficher le titre du site
					</label>
					<div class="help_text"><:tispipskelet:help_entete_titre_site:></div>
				</div>
			</li>
		</ul>
		<ul id="cfgtitresite">
			<li>
				<span class="titre">Taille de police du titre</span>
				<div class="labels_cfg_tispipskelet">
					<label>Taille (en pixels)
					<input type="text" name="taille_titre" size="4" value="[(#ENV{taille_titre}|?{#ENV{taille_titre},24})]" /></label>
				</div>
			</li>
			<li>
				<span class="titre">Position du titre &agrave; partir du haut de l&rsquo;&eacute;cran</span>
				<div class="labels_cfg_tispipskelet">
					<label>Distance (en pixels)
					<input type="text" name="titre_pos_v" size="4" value="[(#ENV{titre_pos_v}|?{#ENV{titre_pos_v},10})]" /></label>
				</div>
			</li>
			<li>
				<span class="titre">Position du titre &agrave; partir de la gauche de l&rsquo;&eacute;cran</span>
				<div class="labels_cfg_tispipskelet">
					<label>Distance (en pixels)
					<input type="text" name="titre_pos_h" size="4" value="[(#ENV{titre_pos_h}|?{#ENV{titre_pos_h},150})]" /></label>
				</div>
			</li>
		</ul>
	</fieldset>
<script type="text/javascript"><!--
	$('#affimgpalogo')
	.bind('change', function() {
            $('#img_palogo').slideToggle('slow');
	})
	if ($('#affimgpalogo:checked').length == 0)
		$('#img_palogo').hide();

	$('#afflogosite')
	.bind('change', function() {
		var on = $(this).is(':checked');
		$(this)
		.parents('fieldset')
		.find('#affimgpalogo')
			.attr('disabled', on ? 'disabled' : '')
		.end();
	})
	
	$('#affimgpalogo')
	.bind('change', function() {
		var on = $(this).is(':checked');
		$(this)
		.parents('fieldset')
		.find('#afflogosite')
			.attr('disabled', on ? 'disabled' : '')
		.end();
	})
	
	$('#afftitresite')
	.bind('change', function() {
            $('#cfgtitresite').slideToggle('slow');
	})
	if ($('#afftitresite:checked').length == 0)
		$('#cfgtitresite').hide();

// --></script>

	<fieldset>
		<legend>Image et commentaires &agrave; droite de l&rsquo;ent&ecirc;te</legend>
		<ul>
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label class="titre"><input type="checkbox" name="afftextentete" value="oui" [checked="(#ENV{afftextentete}|?{checked})" ] id="afftextentete" /> Afficher un texte &agrave; droite de l&rsquo;ent&ecirc;te
					</label>
					<div class="help_text"><:tispipskelet:help_entete_commentaires:></div>
				</div>
			
				<div id="texte_entete" class="labels_cfg_tispipskelet">
					<label>
					<input type="radio" name="texte_entete" value="descriptif-site" [(#ENV{texte_entete}|=={descriptif-site}|?{checked,''})] />Descriptif du site</label><br />
					<div class="descriptif">[(#DESCRIPTIF_SITE_SPIP|?{#DESCRIPTIF_SITE_SPIP,<:tispipskelet:info_descriptif:>})]</div>
					<label>
					<input type="radio" name="texte_entete" value="textlibre" [(#ENV{texte_entete}|=={textlibre}|?{checked,''})] />Texte libre</label><br class="leon" /><br />
					<div class="form-item">
						<span class="label_couleur"><label for="color_texte_entete">Couleur du texte :</label></span>
						<input type="text" name="color_texte_entete" id="color_texte_entete"  class="fondl cfg_couleur" size="7"  value="[(#ENV{color_texte_entete}|?{#ENV{color_texte_entete},#000000})]" />
					</div>
					<label>Votre texte
					<textarea name="text_libre_entete" rows="4" cols="40" style="width:100%;">[(#ENV{texte_entete}|=={textlibre}|?{#ENV{text_libre_entete}})]</textarea></label><br />
				</div>
			</li>
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label class="titre"><input type="checkbox" name="affimg_entete" value="oui" [checked="(#ENV{affimg_entete}|?{checked})" ] id="affimg_entete" /> Afficher une image &agrave; droite de l&rsquo;ent&ecirc;te
					</label>
					<div class="help_text"><:tispipskelet:help_entete_image_droite:></div>
				</div>
				<div id="cfgimg_entete" class="labels_cfg_tispipskelet">
					<label>Charger l'&rsquo;image :
					<input type="file" name="img_entete" value=" " size="30" /></label>
					[<span class='erreur'>(#ENV**{erreurs}|table_valeur{img_entete})</span>]
					<br />	
		
					<h5>Image actuelle</h5>
					<dl>		
						<dt>[(#ENV{img_entete}|?{[(#CFG_CHEMIN{tispipskelet_conf/entete/img_entete}|image_reduire{100})],Aucune image})]</dt>
					</dl>
				</div>
			</li>
			<li>
				<div class="labels_cfg_tispipskelet">
					<span class="help_conf">&nbsp;?&nbsp;</span>
					<label class="titre"><input type="checkbox" name="affimg_entete_bg" value="oui" [checked="(#ENV{affimg_entete_bg}|?{checked})" ] id="affimg_entete_bg" /> Afficher une image d&rsquo;arri&egrave;re plan &agrave; droite de l&rsquo;ent&ecirc;te
					</label>
					<div class="help_text"><:tispipskelet:help_entete_bg_droite:></div>
				</div>
				<div id="cfgimg_entete_bg" class="labels_cfg_tispipskelet">
					<label>Charger l'&rsquo;image :
					<input type="file" name="img_entete_bg" value=" " size="30" /></label>
					[<span class='erreur'>(#ENV**{erreurs}|table_valeur{img_entete_bg})</span>]
					<br />	
		
					<h5>Image d&rsquo;arri&egrave;re plan actuelle</h5>
					<dl>		
						<dt>[(#ENV{img_entete_bg}|?{[(#CFG_CHEMIN{tispipskelet_conf/entete/img_entete_bg}|image_reduire{100})],Aucune image})]</dt>
					</dl>
				</div>
			</li>
		</ul>
	</fieldset>
<script type="text/javascript"><!--
	$('#afftextentete')
	.bind('change', function() {
            $('#texte_entete').slideToggle('slow');
	})
	if ($('#afftextentete:checked').length == 0)
		$('#texte_entete').hide();

	$('#affimg_entete')
	.bind('change', function() {
            $('#cfgimg_entete').slideToggle('slow');
	})
	if ($('#affimg_entete:checked').length == 0)
		$('#cfgimg_entete').hide();

	$('#affimg_entete_bg')
	.bind('change', function() {
            $('#cfgimg_entete_bg').slideToggle('slow');
	})
	if ($('#affimg_entete_bg:checked').length == 0)
		$('#cfgimg_entete_bg').hide();
// --></script>
<script type="text/javascript">
	$(document).ready(function() {
		$('div.help_text').prepend('<span class=\'help_close\'>&nbsp;X&nbsp;</span>');
        $('form#form_cfg_tispipskelet div.help_text').hide(); 
        $('form#form_cfg_tispipskelet span.help_conf').click(function() {
		  var $boutton = $(this);
          var $nextDiv = $(this).siblings('div.help_text');
          var $visibleSiblings = $('form#form_cfg_tispipskelet')
				.find('div.help_text:visible');
           var $hideSiblings = $('form#form_cfg_tispipskelet')
				.find('span.help_conf');
      
          if ($visibleSiblings.length) {
            $visibleSiblings.slideUp('slow', function() {
              $nextDiv.slideToggle('slow');
			  $hideSiblings.fadeIn('slow');
 			 $boutton.fadeOut('slow');
          });
          } else {
             $nextDiv.slideToggle('fast');
			 $boutton.fadeOut('slow');
          }
        });
		$('form#form_cfg_tispipskelet span.help_close').click(function() {
				$(this).parent().slideUp('slow');
				$(this).parents('.labels_cfg_tispipskelet')
				.find('span.help_conf:hidden').fadeIn('slow');
		});
	});
</script>
<input type="submit" name="_cfg_ok" value="<:cfg:OK:>" />
<input type="reset" value="<:cfg:Reset:>" />
<input type="submit" name="_cfg_delete" value="<:cfg:Supprimer:>" />

</div></form>
